<template>
  <ContentWrap>
    <el-form
      ref="formRef"
      :model="formData"
      :rules="formRules"
      label-width="120px"
      v-loading="formLoading"
    >
      <el-row :gutter="20">
        <el-col :span="21">
          <ContentWrap title="基础信息">
            <el-alert
              title="注：请让您的司机安装司机APP，以便能实时接收到您发布的运输任务！手机号即为登录账号。"
              type="warning"
              show-icon
              :closable="false"
              style="margin-bottom: 15px"
            />
            <el-row>
              <el-col :span="8">
                <el-form-item label="姓名" prop="driverName">
                  <el-input v-model="formData.driverName" placeholder="请输入司机名称" />
                </el-form-item>
              </el-col>
              <el-col :span="8">
                <el-form-item label="性别" prop="driverGender">
                  <el-select v-model="formData.driverGender" placeholder="请选择性别">
                    <el-option
                      v-for="dict in getIntDictOptions(DICT_TYPE.GENDER)"
                      :key="dict.value"
                      :label="dict.label"
                      :value="dict.value"
                    />
                  </el-select>
                </el-form-item>
              </el-col>
              <el-col :span="8">
                <el-form-item label="手机电话" prop="driverPhone">
                  <el-input v-model="formData.driverPhone" placeholder="请输入手机电话" />
                </el-form-item>
              </el-col>
            </el-row>
            <el-row>
              <el-col :span="8">
                <el-form-item label="身份证号" prop="driverIdCardNo">
                  <el-input v-model="formData.driverIdCardNo" placeholder="请输入证件号码" />
                </el-form-item>
              </el-col>
              <el-col :span="8">
                <el-form-item label="签发机关" prop="grantOrg">
                  <el-input v-model="formData.grantOrg" placeholder="请输入签发机关" />
                </el-form-item>
              </el-col>
              <el-col :span="8">
                <el-form-item label="承运商" prop="carrierUscc">
                  <el-select v-model="formData.carrierUscc" placeholder="请选择承运商" @change="carrierChange">
                    <el-option
                      v-for="dict in carrierList"
                      :key="dict.carrierUscc"
                      :label="dict.carrierName"
                      :value="dict.carrierUscc"
                    />
                  </el-select>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row>
              <el-col :span="8">
                <el-form-item label="有效起始日期" prop="icStartDate" disabled>
                  <!--              <el-date-picker-->
                  <!--                v-model="formData.icStartDate"-->
                  <!--                type="date"-->
                  <!--                value-format="YYYY-MM-DD"-->
                  <!--                placeholder="选择有效起始日期"-->
                  <!--              />-->
                  <el-input v-model="formData.icStartDate" placeholder="请输入有效起始日期" />
                </el-form-item>
              </el-col>
              <el-col :span="8">
                <el-form-item label="有效终止日期" prop="icEndDate" disabled>
                  <!--              <el-date-picker-->
                  <!--                v-model="formData.icEndDate"-->
                  <!--                type="date"-->
                  <!--                value-format="YYYY-MM-DD"-->
                  <!--                @change="icEndDateChange"-->
                  <!--                :shortcuts="shortcuts"-->
                  <!--                :placeholder="icPlaceholder"-->
                  <!--                :class="{ 'el-date-editor1': icPlaceholder == '长期' }"-->
                  <!--              />-->
                  <el-input v-model="formData.icEndDate" placeholder="请输入有效终止日期" />
                </el-form-item>
              </el-col>
            </el-row>
            <el-row>
              <el-col :span="8">
                <el-form-item label="身份证正面" prop="cardFrontFiles">
                  <el-upload
                    ref="uploadRef"
                    list-type="picture-card"
                    :auto-upload="false"
                    :on-change="handleCardFrontChange"
                    v-model:file-list="formData.cardFrontFiles"
                    :class="{ disabled: cardFrontDisabled }"
                  >
                    <el-icon><UploadFilled /></el-icon>
                    <template #file="{ file }">
                      <div>
                        <img class="el-upload-list__item-thumbnail" :src="file.url" alt="" />
                        <span class="el-upload-list__item-actions">
                      <span
                        class="el-upload-list__item-preview"
                        @click="handlePictureCardPreview(file)"
                      >
                        <el-icon><zoom-in /></el-icon>
                      </span>
                      <span
                        v-if="!disabled"
                        class="el-upload-list__item-delete"
                        @click="handleCardFrontRemove(file)"
                      >
                        <el-icon><Delete /></el-icon>
                      </span>
                    </span>
                      </div>
                    </template>
                  </el-upload>
                  <!--              <el-button type="primary" plain style="margin-left: 20px" @click="idcardOcr">识别</el-button>-->
                </el-form-item>
              </el-col>
              <el-col :span="8">
                <el-form-item label="身份证反面" prop="cardBackFiles">
                  <el-upload
                    ref="uploadRef"
                    list-type="picture-card"
                    :auto-upload="false"
                    :on-change="handleCardBackChange"
                    v-model:file-list="formData.cardBackFiles"
                    :class="{ disabled: cardBackDisabled }"
                  >
                    <el-icon><UploadFilled /></el-icon>
                    <template #file="{ file }">
                      <div>
                        <img class="el-upload-list__item-thumbnail" :src="file.url" alt="" />
                        <span class="el-upload-list__item-actions">
                      <span
                        class="el-upload-list__item-preview"
                        @click="handlePictureCardPreview(file)"
                      >
                        <el-icon><zoom-in /></el-icon>
                      </span>
                      <span
                        v-if="!disabled"
                        class="el-upload-list__item-delete"
                        @click="handleCardBackRemove(file)"
                      >
                        <el-icon><Delete /></el-icon>
                      </span>
                    </span>
                      </div>
                    </template>
                  </el-upload>
                  <!--              <el-button type="primary" plain style="margin-left: 20px" @click="idcardBackOcr">识别</el-button>-->
                </el-form-item>
              </el-col>
            </el-row>
          </ContentWrap>
          <ContentWrap title="驾驶证信息">
            <el-row>
              <el-col :span="8">
                <el-form-item label="驾驶证号" prop="driverLicenseNo">
                  <el-input v-model="formData.driverLicenseNo" placeholder="请输入驾驶证号" />
                </el-form-item>
              </el-col>
              <el-col :span="8">
                <el-form-item label="准驾类型" prop="approveType">
                  <el-select v-model="formData.approveType" placeholder="请选择准驾类型">
                    <el-option
                      v-for="dict in getStrDictOptions(DICT_TYPE.APPROVE_MODEL)"
                      :key="dict.value"
                      :label="dict.label"
                      :value="dict.value"
                    />
                  </el-select>
                </el-form-item>
              </el-col>
              <el-col :span="8">
                <el-form-item label="初次领证时间" prop="firstCertDate">
                  <!--              <el-date-picker-->
                  <!--                v-model="formData.firstCertDate"-->
                  <!--                type="date"-->
                  <!--                value-format="YYYY-MM-DD"-->
                  <!--                placeholder="选择初次领证时间"-->
                  <!--              />-->
                  <el-input v-model="formData.firstCertDate" placeholder="请输入初次领证时间" />
                </el-form-item>
              </el-col>
            </el-row>
            <el-row>
              <el-col :span="8">
                <el-form-item label="发证机关" prop="issueOrg">
                  <el-input v-model="formData.issueOrg" placeholder="请输入发证机关" />
                </el-form-item>
              </el-col>
              <el-col :span="8">
                <el-form-item label="有效起始日期" prop="dlStartDate">
                  <!--              <el-date-picker-->
                  <!--                v-model="formData.dlStartDate"-->
                  <!--                type="date"-->
                  <!--                value-format="YYYY-MM-DD"-->
                  <!--                placeholder="选择驾驶证有效起始日期"-->
                  <!--              />-->
                  <el-input v-model="formData.dlStartDate" placeholder="请输入有效起始日期" />
                </el-form-item>
              </el-col>
              <el-col :span="8">
                <el-form-item label="有效终止日期" prop="dlEndDate">
                  <!--              <el-date-picker-->
                  <!--                v-model="formData.dlEndDate"-->
                  <!--                type="date"-->
                  <!--                value-format="YYYY-MM-DD"-->
                  <!--                :editable="false"-->
                  <!--                @change="dlEndDateChange"-->
                  <!--                :shortcuts="dlshortcuts"-->
                  <!--                :placeholder="dlPlaceholder"-->
                  <!--                :class="{ 'el-date-editor1': dlPlaceholder == '长期' }"-->
                  <!--              />-->
                  <el-input v-model="formData.dlEndDate" placeholder="请输入有效终止日期" />
                </el-form-item>
              </el-col>
            </el-row>
            <el-row>
              <el-col :span="8">
                <el-form-item label="驾驶证正面" prop="licenseFrontFiles">
                  <el-upload
                    ref="licenseFrontUploadRef"
                    list-type="picture-card"
                    :auto-upload="false"
                    :on-change="handleLicenseFrontChange"
                    v-model:file-list="formData.licenseFrontFiles"
                    :class="{ disabled: licenseFrontDisabled }"
                  >
                    <el-icon><UploadFilled /></el-icon>
                    <template #file="{ file }">
                      <div>
                        <img class="el-upload-list__item-thumbnail" :src="file.url" alt="" />
                        <span class="el-upload-list__item-actions">
                      <span
                        class="el-upload-list__item-preview"
                        @click="handlePictureCardPreview(file)"
                      >
                        <el-icon><zoom-in /></el-icon>
                      </span>
                      <span
                        v-if="!disabled"
                        class="el-upload-list__item-delete"
                        @click="handleLicenseFrontRemove(file)"
                      >
                        <el-icon><Delete /></el-icon>
                      </span>
                    </span>
                      </div>
                    </template>
                  </el-upload>
                  <!--              <el-button type="primary" plain style="margin-left: 20px" @click="licenseFrontFilesOcr">识别</el-button>-->
                </el-form-item>
              </el-col>
              <el-col :span="8">
                <el-form-item label="驾驶证副页" prop="licenseBackFiles">
                  <el-upload
                    ref="uploadRef"
                    list-type="picture-card"
                    :auto-upload="false"
                    :on-change="handleLicenseBackChange"
                    v-model:file-list="formData.licenseBackFiles"
                    :class="{ disabled: licenseBackDisabled }"
                  >
                    <el-icon><UploadFilled /></el-icon>
                    <template #file="{ file }">
                      <div>
                        <img class="el-upload-list__item-thumbnail" :src="file.url" alt="" />
                        <span class="el-upload-list__item-actions">
                      <span
                        class="el-upload-list__item-preview"
                        @click="handlePictureCardPreview(file)"
                      >
                        <el-icon><zoom-in /></el-icon>
                      </span>
                      <span
                        v-if="!disabled"
                        class="el-upload-list__item-delete"
                        @click="handleLicenseBackRemove(file)"
                      >
                        <el-icon><Delete /></el-icon>
                      </span>
                    </span>
                      </div>
                    </template>
                  </el-upload>
                  <!--              <el-button type="primary" plain style="margin-left: 20px" @click="licenseBackFilesOcr">识别</el-button>-->
                </el-form-item>
              </el-col>
            </el-row>
          </ContentWrap>
          <ContentWrap title="从业资格信息">
            <el-row>
              <el-col :span="8">
                <el-form-item label="从业资格证号" prop="certNo">
                  <el-input v-model="formData.certNo" placeholder="请输入从业资格证号" />
                </el-form-item>
              </el-col>
            </el-row>
            <el-row>
              <el-col :span="8">
                <el-form-item label="从业资格证类别" prop="certKind">
                  <el-select v-model="formData.certKind" placeholder="请选择从业资格证类别">
                    <el-option
                      v-for="dict in getStrDictOptions(DICT_TYPE.CERT_KIND)"
                      :key="dict.value"
                      :label="dict.label"
                      :value="dict.value"
                    />
                  </el-select>
                </el-form-item>
              </el-col>
              <el-col :span="8">
                <el-form-item label="发证机关" prop="certIssueOrg">
                  <el-input v-model="formData.certIssueOrg" placeholder="请输入发证机关" />
                </el-form-item>
              </el-col>
              <el-col :span="8">
                <el-form-item label="有效期至" prop="certEndDate">
                  <el-date-picker
                    v-model="formData.certEndDate"
                    type="date"
                    value-format="YYYY-MM-DD"
                    placeholder="选择有效期至"
                  />
                </el-form-item>
              </el-col>
            </el-row>
            <el-row>
              <el-col :span="8">
                <el-form-item label="从业资格证照" prop="certFiles">
                  <el-upload
                    ref="uploadRef"
                    list-type="picture-card"
                    :auto-upload="false"
                    :on-change="handleCertChange"
                    v-model:file-list="formData.certFiles"
                    :class="{ disabled: certDisabled }"
                  >
                    <el-icon><UploadFilled /></el-icon>
                    <template #file="{ file }">
                      <div>
                        <img class="el-upload-list__item-thumbnail" :src="file.url" alt="" />
                        <span class="el-upload-list__item-actions">
                      <span
                        class="el-upload-list__item-preview"
                        @click="handlePictureCardPreview(file)"
                      >
                        <el-icon><zoom-in /></el-icon>
                      </span>
                      <span
                        v-if="!disabled"
                        class="el-upload-list__item-delete"
                        @click="handleCertRemove(file)"
                      >
                        <el-icon><Delete /></el-icon>
                      </span>
                    </span>
                      </div>
                    </template>
                  </el-upload>
                  <!--              <el-button type="primary" plain style="margin-left: 20px" @click="certFilesOcr">识别</el-button>-->
                </el-form-item>
              </el-col>
            </el-row>
          </ContentWrap>
          <el-card :class="[prefixCls, 'mb-15px']" shadow="never" id="target5">
            <template #header>
              <div class="box-card">
                <span style="font-weight: 700; font-size: 16px;">银行账户信息(非必填项)</span>
                <el-button type="primary" @click="openBank" style="float: right"
                >新增
                </el-button>
              </div>
            </template>
            <el-table v-loading="loading" :data="bankList">
              <el-table-column label="收款人" align="center" prop="payeeName" />
              <el-table-column
                label="开户行编码"
                align="center"
                prop="bankCode"
              />
              <el-table-column label="开户行" align="center" prop="bankName" />
              <el-table-column label="开户支行" align="center" prop="bankBranchName" />
              <el-table-column label="开户名" align="center" prop="bankAccountName" />
              <el-table-column label="银行账号" align="center" prop="bankAccountNo" />
              <el-table-column label="操作" align="center">
                <template #default="scope">
                  <el-button link type="primary" @click="editBank(scope)">编辑</el-button>
                  <el-button link type="danger" @click="handleBankDelete('0', scope)">删除</el-button>
                </template>
              </el-table-column>
            </el-table>
          </el-card>
        </el-col>
        <el-col :span="3">
          <el-affix :offset="60">
            <el-anchor :container="containerRef"
                       direction="vertical" :offset="30" type="underline"  @click="handleClick">
              <el-anchor-link href="#target1">
                基本信息
              </el-anchor-link>
              <el-anchor-link href="#target2">
                驾驶证信息
              </el-anchor-link>
              <el-anchor-link href="#target3">
                从业资格信息
              </el-anchor-link>
              <el-anchor-link href="#target4">
                银行账户信息
              </el-anchor-link>
            </el-anchor>
          </el-affix>
        </el-col>
      </el-row>
      <el-form-item style="float: right">
        <el-button @click="submitForm" type="primary" :disabled="formLoading">确 定</el-button>
        <el-button @click="close">返 回</el-button>
      </el-form-item>
    </el-form>
    <el-image-viewer
      v-if="dialogVisible"
      @close="closeViewer"
      :url-list="[dialogImageUrl]"
    />
    <!-- 银行信息 -->
    <el-dialog v-model="bankDialogVisible" title="新增银行信息" width="50%">
      <el-form
        ref="bankFormRef"
        :model="customerBankData"
        :rules="customerBankRules"
        label-width="240px"
        v-loading="formLoading"
        class="demo-form-inline"
      >
        <el-form-item label="收款人" prop="payeeName">
          <el-input v-model="customerBankData.payeeName" placeholder="请输入收款人" />
        </el-form-item>
        <!--        <el-form-item label="开户银行编码" prop="bankCode">-->
        <!--          <el-input v-model="customerBankData.bankCode" placeholder="请输入开户银行编码" />-->
        <!--        </el-form-item>-->
        <el-form-item label="开户银行" prop="bankCode">
          <el-select
            v-model="customerBankData.bankCode"
            placeholder="请选择开户银行"
            style="width: 200px"
            @change="bankChange"
          >
            <el-option
              v-for="dict in getStrDictOptions(DICT_TYPE.BANK)"
              :key="dict.value"
              :label="dict.label"
              :value="dict.value"
            />
          </el-select>
        </el-form-item>
        <el-form-item label="开户支行" prop="bankBranchName">
          <el-input v-model="customerBankData.bankBranchName" placeholder="请输入开户支行" />
        </el-form-item>
        <el-form-item label="银行账号" prop="bankAccountNo">
          <el-input v-model="customerBankData.bankAccountNo" placeholder="请输入银行账号" />
        </el-form-item>
        <el-form-item label="开户名/开户单位" prop="bankAccountName">
          <el-input v-model="customerBankData.bankAccountName" placeholder="请输入开户名/开户单位" />
        </el-form-item>
      </el-form>
      <template #footer>
        <span class="dialog-footer">
          <el-button @click="bankDialogVisible = false">关闭</el-button>
          <el-button type="primary" @click="handleBanklick">确认</el-button>
        </span>
      </template>
    </el-dialog>
  </ContentWrap>
</template>
<script setup lang="ts">
import { DriverApi } from '@/api/base/driver'
import { CarrierApi } from '@/api/base/carrier'
import { DICT_TYPE, getIntDictOptions, getStrDictOptions } from '@/utils/dict'
import type { UploadFile } from 'element-plus'
import { Delete, ZoomIn, UploadFilled } from '@element-plus/icons-vue'
import { CheckStatusEnum } from '@/utils/constants'
import { useTagsViewStore } from '@/store/modules/tagsView'
import {useDesign} from "@/hooks/web/useDesign";
const { getPrefixCls } = useDesign()
const bankDialogVisible = ref(false) //银行卡弹窗
const prefixCls = getPrefixCls('content-wrap')
const { t } = useI18n() // 国际化
const { query } = useRoute() // 查询参数
const message = useMessage() // 消息弹窗
const { push, currentRoute } = useRouter() // 路由
const { delView } = useTagsViewStore() // 视图操作
const dialogVisible = ref(false) // 弹窗的是否展示
// const dialogTitle = ref('') // 弹窗的标题
const formLoading = ref(false) // 表单的加载中：1）修改时的数据加载；2）提交的按钮禁用
const formType = ref('') // 表单的类型：create - 新增；update - 修改
const formData = ref({
  id: undefined,
  carrierUscc: undefined,
  carrierName: undefined,
  driverName: undefined,
  driverGender: 1,
  driverPhone: undefined,
  driverIdCardNo: undefined,
  driverKind: 1,
  grantOrg: undefined,
  icStartDate: undefined,
  icEndDate: undefined,
  idCardFrontUrl: undefined,
  idCardBackUrl: undefined,
  driverLicenseNo: undefined,
  approveType: undefined,
  firstCertDate: undefined,
  issueOrg: undefined,
  dlStartDate: undefined,
  dlEndDate: undefined,
  licenseName: undefined,
  licenseFrontUrl: undefined,
  licenseBackUrl: undefined,
  certNo: undefined,
  certKind: undefined,
  certIssueOrg: undefined,
  certEndDate: undefined,
  certUrl: undefined,
  authStatus: CheckStatusEnum.AUDIT.status,
  cardFrontFiles: [],
  cardBackFiles: [],
  licenseFrontFiles: [],
  licenseBackFiles: [],
  certFiles: []
})
const formRules = reactive({
  driverName: [{ required: true, message: '姓名不能为空', trigger: 'blur' }],
  driverGender: [{ required: true, message: '性别不能为空', trigger: 'blur' }],
  driverPhone: [{ required: true, message: '手机号不能为空', trigger: 'blur' }],
  driverIdCardNo: [{ required: true, message: '身份证号不能为空', trigger: 'blur' }],
  driverKind: [{ required: true, message: '司机所属不能为空', trigger: 'blur' }],
  icStartDate: [{ required: true, message: '证件有效起始日期不能为空', trigger: 'blur' }],
  icEndDate: [{ required: true, message: '证件有效终止日期不能为空', trigger: 'blur' }],
  cardFrontFiles: [{ required: true, message: '身份证正面不能为空', trigger: 'blur' }],
  cardBackFiles: [{ required: true, message: '身份证反面不能为空', trigger: 'blur' }],
  driverLicenseNo: [{ required: true, message: '驾驶证号不能为空', trigger: 'blur' }],
  approveModel: [{ required: true, message: '准驾车型不能为空', trigger: 'blur' }],
  issueOrg: [{ required: true, message: '发证机关不能为空', trigger: 'blur' }],
  dlStartDate: [{ required: true, message: '驾驶证有效起始日期不能为空', trigger: 'blur' }],
  dlEndDate: [{ required: true, message: '驾驶证有效终止日期不能为空', trigger: 'blur' }],
  licenseFrontFiles: [{ required: true, message: '驾驶证正面不能为空', trigger: 'blur' }],
  licenseBackFiles: [{ required: true, message: '驾驶证副页不能为空', trigger: 'blur' }],
  certNo: [{ required: true, message: '从业资格证号不能为空', trigger: 'blur' }],
  certEndDate: [{ required: true, message: '有效期至不能为空', trigger: 'blur' }]
})
const icPlaceholder = ref('请输入有效终止日期')
const dlPlaceholder = ref('请选择驾驶证有效终止日期')
const formRef = ref() // 表单 Ref
const carrierList = ref([])

/** 打开弹窗 */
const init = async () => {
  let id = query.id as unknown as number
  if (id == 'undefined') {
    id = undefined
  }
  formType.value = query.type
  resetForm()
  carrierList.value = await CarrierApi.getCarrierList({})
  // 修改时，设置数据
  if (id != undefined) {
    formLoading.value = true
    // try {
    //   formData.value = await DriverApi.getDriver(id)
    //   if (formData.value.icEndDate == '长期') {
    //     icPlaceholder.value = '长期'
    //   }
    //   if (formData.value.dlEndDate == '长期') {
    //     dlPlaceholder.value = '长期'
    //   }
    //   if (formData.value.idCardFrontUrl && formData.value.idCardFrontUrl != '') {
    //     cardFrontDisabled.value = true
    //     formData.value.cardFrontFiles = [
    //       {
    //         url: formData.value.idCardFrontUrl
    //       }
    //     ]
    //   }
    //   if (formData.value.idCardBackUrl && formData.value.idCardBackUrl != '') {
    //     cardBackDisabled.value = true
    //     formData.value.cardBackFiles = [
    //       {
    //         url: formData.value.idCardBackUrl
    //       }
    //     ]
    //   }
    //   if (formData.value.licenseFrontUrl && formData.value.licenseFrontUrl != '') {
    //     licenseFrontDisabled.value = true
    //     formData.value.licenseFrontFiles = [
    //       {
    //         url: formData.value.licenseFrontUrl
    //       }
    //     ]
    //   }
    //   console.log('formData.value.licenseBackUrl', formData.value.licenseBackUrl)
    //   if (formData.value.licenseBackUrl && formData.value.licenseBackUrl != '') {
    //     licenseBackDisabled.value = true
    //     formData.value.licenseBackFiles = [
    //       {
    //         url: formData.value.licenseBackUrl
    //       }
    //     ]
    //   }
    //   if (formData.value.certUrl && formData.value.certUrl != '') {
    //     certDisabled.value = true
    //     formData.value.certFiles = [
    //       {
    //         url: formData.value.certUrl
    //       }
    //     ]
    //   }
    // } finally {
    //   formLoading.value = false
    // }
  }
}
// defineExpose({ open }) // 提供 open 方法，用于打开弹窗

/** 提交表单 */
const submitForm = async () => {
  // 校验表单
  if (!formRef) return
  const valid = await formRef.value.validate()
  if (!valid) return
  // if (formType.value === 'create') {
  //   if (formData.value.licenseName != formData.value.driverName) {
  //     message.error('身份证姓名与驾驶证姓名不符')
  //     return
  //   }
  // }
  // 提交请求
  formLoading.value = true
  try {
    // const data = formData.value as unknown as BaseDriverApi.BaseDriverVO
    var paramsData = new FormData()
    paramsData.append('id', formData.value.id != undefined ? formData.value.id : '')
    paramsData.append(
      'carrierUscc',
      formData.value.carrierUscc != undefined ? formData.value.carrierUscc : ''
    )
    paramsData.append(
      'carrierName',
      formData.value.carrierName != undefined ? formData.value.carrierName : ''
    )
    paramsData.append(
      'driverName',
      formData.value.driverName != undefined ? formData.value.driverName : ''
    )
    paramsData.append('driverGender', formData.value.driverGender != undefined ? formData.value.driverGender : '')
    paramsData.append(
      'driverPhone',
      formData.value.driverPhone != undefined ? formData.value.driverPhone : ''
    )
    paramsData.append(
      'driverIdCardNo',
      formData.value.driverIdCardNo != undefined ? formData.value.driverIdCardNo : ''
    )
    paramsData.append(
      'driverKind',
      formData.value.driverKind != undefined ? formData.value.driverKind : ''
    )
    paramsData.append(
      'grantOrg',
      formData.value.grantOrg != undefined ? formData.value.grantOrg : ''
    )
    paramsData.append('icStartDate', formData.value.icStartDate)
    if (icPlaceholder.value == '长期') {
      paramsData.append('icEndDate', '长期')
    } else {
      paramsData.append('icEndDate', formData.value.icEndDate)
    }
    paramsData.append(
      'driverLicenseNo',
      formData.value.driverLicenseNo != undefined ? formData.value.driverLicenseNo : ''
    )
    paramsData.append(
      'approveType',
      formData.value.approveType != undefined ? formData.value.approveType : ''
    )
    if (formData.value.firstCertDate != undefined) {
      paramsData.append('firstCertDate', formData.value.firstCertDate)
    }
    paramsData.append(
      'issueOrg',
      formData.value.issueOrg != undefined ? formData.value.issueOrg : ''
    )
    paramsData.append('dlStartDate', formData.value.dlStartDate)
    if (dlPlaceholder.value == '长期') {
      paramsData.append('dlEndDate', '长期')
    } else {
      paramsData.append('dlEndDate', formData.value.dlEndDate)
    }
    paramsData.append('certNo', formData.value.certNo != undefined ? formData.value.certNo : '')
    paramsData.append(
      'certKind',
      formData.value.certKind != undefined ? formData.value.certKind : ''
    )
    paramsData.append(
      'certIssueOrg',
      formData.value.certIssueOrg != undefined ? formData.value.certIssueOrg : ''
    )
    paramsData.append('certEndDate', formData.value.certEndDate)
    paramsData.append(
      'authStatus',
      formData.value.authStatus != undefined ? formData.value.authStatus : ''
    )
    // if (formData.value.blFiles && typeof formData.value.blFiles[0].raw != 'undefined') {
    //   paramsData.append('file', formData.value.blFiles[0].raw)
    // }
    if (formData.value.cardFrontFiles && typeof formData.value.cardFrontFiles[0].raw != 'undefined') {
      paramsData.append('cardFrontFile', formData.value.cardFrontFiles[0].raw)
    }

    if (formData.value.cardBackFiles && typeof formData.value.cardBackFiles[0].raw != 'undefined') {
      paramsData.append('cardBackFile', formData.value.cardBackFiles[0].raw)
    }

    if (formData.value.licenseFrontFiles && typeof formData.value.licenseFrontFiles[0].raw != 'undefined') {
      paramsData.append('licenseFrontFile', formData.value.licenseFrontFiles[0].raw)
    }

    if (formData.value.licenseBackFiles && typeof formData.value.licenseBackFiles[0].raw != 'undefined') {
      paramsData.append('licenseBackFile', formData.value.licenseBackFiles[0].raw)
    }

    if (formData.value.certFiles && typeof formData.value.certFiles[0].raw != 'undefined') {
      paramsData.append('certFile', formData.value.certFiles[0].raw)
    }

    if (formType.value === 'create') {
      await DriverApi.createDriver(paramsData)
      message.success(t('common.createSuccess'))
    } else {
      await DriverApi.updateDriver(paramsData)
      message.success(t('common.updateSuccess'))
    }
    dialogVisible.value = false
    close()
  } finally {
    formLoading.value = false
  }
}

/** 重置表单 */
const resetForm = () => {
  formData.value = {
    id: undefined,
    carrierUscc: undefined,
    carrierName: undefined,
    driverName: undefined,
    gender: 1,
    driverPhone: undefined,
    idCardNo: undefined,
    driverKind: 1,
    grantOrg: undefined,
    icStartDate: undefined,
    icEndDate: undefined,
    idCardFrontUrl: undefined,
    idCardBackUrl: undefined,
    driverLicenseNo: undefined,
    approveModel: undefined,
    firstCertDate: undefined,
    issueOrg: undefined,
    dlStartDate: undefined,
    dlEndDate: undefined,
    licenseFrontUrl: undefined,
    licenseBackUrl: undefined,
    certNo: undefined,
    certKind: undefined,
    certIssueOrg: undefined,
    certEndDate: undefined,
    certUrl: undefined,
    authStatus: CheckStatusEnum.AUDIT.status
  }
  formRef.value?.resetFields()
}

//文件上传
const cardFrontDisabled = ref(false)
const cardBackDisabled = ref(false)
const licenseFrontDisabled = ref(false)
const licenseBackDisabled = ref(false)
const certDisabled = ref(false)
const disabled = ref(false)
const dialogImageUrl = ref('')

const handleCardFrontChange = (file: any, fileList: any) => {
  console.log(fileList)
  formData.value.cardFrontFiles = fileList
  console.log(formData.value.cardFrontFiles)
  console.log(formData.value.cardFrontFiles[0].raw)
  cardFrontDisabled.value = fileList.length >= 1
}

const handleCardBackChange = (file: any, fileList: any) => {
  formData.value.cardBackFiles = fileList
  cardBackDisabled.value = fileList.length >= 1
}

const handleLicenseFrontChange = (file: any, fileList: any) => {
  formData.value.licenseFrontFiles = fileList
  licenseFrontDisabled.value = fileList.length >= 1
}

const handleLicenseBackChange = (file: any, fileList: any) => {
  formData.value.licenseBackFiles = fileList
  licenseBackDisabled.value = fileList.length >= 1
}

const handleCertChange = (file: any, fileList: any) => {
  formData.value.certFiles = fileList
  certDisabled.value = fileList.length >= 1
}

const handleCardFrontRemove = () => {
  cardFrontDisabled.value = false
  formData.value.cardFrontFiles = []
}

const handleCardBackRemove = () => {
  cardBackDisabled.value = false
  formData.value.cardBackFiles = []
}

const handleLicenseFrontRemove = () => {
  licenseFrontDisabled.value = false
  formData.value.licenseFrontFiles = []
}

const handleLicenseBackRemove = () => {
  licenseBackDisabled.value = false
  formData.value.licenseBackFiles = []
}

const handleCertRemove = () => {
  certDisabled.value = false
  formData.value.certFiles = []
}

//共用
const handlePictureCardPreview = (file: UploadFile) => {
  dialogImageUrl.value = file.url
  dialogVisible.value = true
}

/** 关闭按钮 */
const close = () => {
  delView(unref(currentRoute))
  push('/base/base-driver')
}

const closeViewer = () => {
  dialogVisible.value = false
}

//日期
const shortcuts = [
  {
    text: '长期',
    value: () => {
      formData.value.icEndDate = '长期'
      icPlaceholder.value = '长期'
      return '长期'
    }
  }
]

const dlshortcuts = [
  {
    text: '长期',
    value: () => {
      formData.value.dlEndDate = '长期'
      dlPlaceholder.value = '长期'
      return '长期'
    }
  }
]

const icEndDateChange = (event: any) => {
  console.log(event)
  if (event != 'Invalid Date') {
    formData.value.icEndDate = event
    icPlaceholder.value = '请输入有效终止日期'
  }
}

const dlEndDateChange = (event: any) => {
  console.log(event)
  if (event != 'Invalid Date') {
    formData.value.dlEndDate = event
    dlPlaceholder.value = '请选择驾驶证有效终止日期'
  }
}

//OCR认证
// const idcardOcr = async () => {
//   var paramsData = new FormData()
//   paramsData.append('cardFrontFiles', formData.value.cardFrontFiles[0].raw)
//   const idcard = await DriverApi.cardOcr(paramsData)
//   console.log(idcard.name)
//   formData.value.driverName = idcard.name
//   if(idcard.sex == '男'){
//     formData.value.gender = 0
//   }else{
//     formData.value.gender = 1
//   }
//   formData.value.idCardNo = idcard.number
// }
//
// const idcardBackOcr = async () => {
//   var paramsData = new FormData()
//   paramsData.append('cardBackFiles', formData.value.cardBackFiles[0].raw)
//   const idcard = await DriverApi.cardOcr(paramsData)
//   console.log(idcard)
//   formData.value.grantOrg = idcard.issue
//   formData.value.icStartDate = idcard.valid_from
//   formData.value.icEndDate = idcard.valid_to
// }
//
// const licenseFrontFilesOcr = async () => {
//   var paramsData = new FormData()
//   paramsData.append('licenseFrontFiles', formData.value.licenseFrontFiles[0].raw)
//   const idcard = await DriverApi.cardOcr(paramsData)
//   console.log(idcard)
//   formData.value.licenseName = idcard.name
//   formData.value.driverLicenseNo = idcard.number
//   formData.value.approveModel = idcard.class
//   formData.value.firstCertDate = idcard.issue_date
//   formData.value.issueOrg = idcard.issuing_authority
//   formData.value.dlStartDate = idcard.valid_from
//   formData.value.dlEndDate = idcard.valid_to
// }
//
// const licenseBackFilesOcr = async () => {
//   var paramsData = new FormData()
//   paramsData.append('licenseBackFiles', formData.value.licenseBackFiles[0].raw)
//   const idcard = await DriverApi.cardOcr(paramsData)
//   console.log(idcard)
// }
//
// const certFilesOcr = async () => {
//   var paramsData = new FormData()
//   paramsData.append('certFiles', formData.value.certFiles[0].raw)
//   const idcard = await DriverApi.cardOcr(paramsData)
//   console.log(idcard)
// }

const carrierChange = (carrierUscc: string) => {
  console.log(carrierUscc)
  const carrierData = carrierList.value.find((item) => {
    return item.carrierUscc == carrierUscc
  })
  console.log(carrierData.carrierName)
  formData.value.carrierUscc = carrierData.carrierUscc
  formData.value.carrierName = carrierData.carrierName
}

const openBank = () => {
  resetCustomerBankForm()
  bankFormType.value = 'create'
  bankDialogVisible.value = true
}

init()
</script>
<style rel="stylesheet/scss" lang="scss">
.disabled .el-upload--picture-card {
  display: none;
}
</style>
